.example{
  border-width: .2rem;

  height: 100vh;
  width: 100vw;
  overflow: hidden;
  background-color: #fffffe;
  display: flex;
  flex-direction: column;
}

.example>div {
  width: 100%;
  padding-top: 5px;
  padding-bottom: 5px;
}
.example>div.header
{ 
  padding-top: 0;flex: 0 1 50%;
  padding-left: 0px;
  position: relative;
}
.example>div.footer
{ 
  padding-bottom: 0;
  flex: 1 1 0%;
  font-size: 14px;
  /* white-space: pre;
  overflow-y: auto; */
}
.example .form-control{ height: 100%;}

.rows .btn{
  margin-right: 4px;
  margin-bottom: 5px;
}
.rows{
  position: relative;
}

.example>div.action{  
  /* display: inline-flex; */
  flex-direction: row;
  vertical-align: middle;
  flex: 0 1 auto;
  padding-left: 15px;
}

.copyresult{
  display: none; position:absolute;z-index:5;background:rgba(0,0,0,0.6);border-radius:3px;line-height:20px;top:0;color:#fff;padding:.2rem .5rem;right:0; opacity: 0; transition: opacity .5s  ease-in-out;
}
.copyresult.active{ opacity: 1; }
